<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>LikeShop 管理后台</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="static/admin/css/login.css">
</head>

<body>
<div class="login">
    <div class="logo">
        <img style="width: auto;height: 42px" src="static/admin/img/login_logo_mall.png"/>
    </div>
    <div class="login-form-box">
        <div class="login-left">
            <div class="login-left-img">
                <img src="static/admin/img/login_form_img.png">
            </div>
        </div>
        <div class="login-right">
            <div class="login-form layui-form">
                <div class="login-title">
                    LikeShop后台登录
                </div>
                <div class="form-box-item">
                    <div class="icon">
                        <img src="static/admin/img/login_number.png">
                    </div>
                    <div>
                        <input type="text" name="account" lay-verify="required" lay-vertype="tips" class="layui-input" style="border:none;width: 150px;padding-left: 20px;" placeholder="请输入账号" value="admin">
                    </div>
                </div>
                <div class="form-box-item">
                    <div class="icon">
                        <img src="static/admin/img/login_password.png">
                    </div>
                    <div>
                        <input type="password" name="password" lay-verify="required" lay-vertype="tips" class="layui-input" style="border:none;width: 150px;padding-left: 20px;" placeholder="请输入密码" value="123456">
                    </div>
                </div>
                <div class="form-box-item">
                    <div class="icon">
                        <img src="/static/admin/img/login_code.png">
                    </div>
                    <div style="display: flex; align-items: center; justify-content: space-between;">
                        <input type="text" name="code" lay-verify="required" lay-vertype="tips" style="border:none;width: 150px;padding-left: 20px;" placeholder="请输入验证码">
                        <img style="height: 36px;width: 126px;" src="static/admin/img/captcha.png" class="layadmin-user-login-codeimg" id="captcha">
                    </div>
                </div>
                <div class="form-box-checked">
                    <div>
                        <input type="checkbox" lay-skin="primary" name="remember_account" title="记住账号">
                    </div>
                </div>
                <button type="button" id="login" lay-filter="login" class="submit-btn" lay-submit style="background-color: #2C85EA">登录</button>
            </div>
        </div>
    </div>
    <footer>
        Copyright &copy; 2019-2021 广州好象科技有限公司&nbsp;&nbsp;<a target="_blank" href="http://www.beian.gov.cn/portal/index.do">京ICP证000000号</a>&nbsp;&nbsp;
    </footer>
</div>
<script src="static/layui/layui.js"></script>
</body>
<script>
    if (self !== top) parent.window.location.replace(window.location.href);
    ;!function () {
        let layer = layui.layer;
        let form = layui.form;
        let $ = layui.jquery;
        //更换图形验证码
        $('body').on('click', '#captcha', function () {
            console.log('更换验证码')
            this.src = 'static/admin/img/captcha?t=' + Date.now();
        });

        $('[name="account"]').keyup(function (event) {
            if (event.keyCode === 13) $('#login').trigger('click');
        })
        $('[name="password"]').keyup(function (event) {
            if (event.keyCode === 13) $('#login').trigger('click');
        })
        $('[name="code"]').keyup(function (event) {
            if (event.keyCode === 13) $('#login').trigger('click');
        })

        //提交
        form.on('submit(login)', function (obj) {
            console.log(obj.field)
            console.log('表单提交事件');
            $.ajax({
                url: '/3.json' //实际使用请改成服务端真实接口  /admin/checks
                , data: obj.field
                , dataType: 'json'
                , type: 'get'
                , success: function (res) {
                    //{code: 0, msg: "账号密码错误", data: [], show: 1, time: "0.031083", wait: 3, url: ""}
                    if (res.code === 1) {
                        layer.msg(res.msg, {
                            offset: '15px'
                            , icon: 1
                            , time: 1000
                        }, function () {
                            location.href = '../'; //后台主页
                        });
                    } else {
                        layer.msg(res.msg, {
                            icon: 2,
                            time: 1000
                        }, function () {
                            $('#captcha').attr('src', 'static/admin/img/captcha.png?t=' + Date.now());
                        });
                    }
                },
            })
        })
    }()

</script>
</html>
